<template>
	<view class="">
		<input type="text" v-model="number" placeholder="简单监听"/>
		简单对象：{{number}}
		<input type="text" placeholder="对象监听" v-model="person.name"/>
		对象对象：{{person}}
	</view>
	
</template>

<script setup>
import {ref, watch, watchEffect} from 'vue'
const number = ref()
const person = ref({
	name: '',
	age: 33
})
watch(number, (newValue, oldValue)=>{
	console.log(newValue, oldValue)
})

//getter函数监听 
// watch(()=>person.value.name, (newValue, oldValue)=>{
// 	console.log(newValue, oldValue)
// })

// watch(person, (newValue)=>{
// 	console.log(newValue)
// },{deep: true, immediate:true})

watchEffect(()=>{
	console.log(person.value.name)
})
</script>

<style lang='scss' scoped>

</style>
